<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=640,user-scalable=no"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp"/>
  <meta name="format-detection" content="telphone=no, email=no"/>
  <meta name="HandheldFriendly" content="true">
  <meta name="MobileOptimized" content="640">
  <meta name="screen-orientation" content="portrait">
  <meta name="x5-orientation" content="portrait">
  <meta name="full-screen" content="yes">
  <meta name="x5-fullscreen" content="true">
  <meta name="browsermode" content="application">
  <meta name="x5-page-mode" content="app">
  <meta name="msapplication-tap-highlight" content="no">
  <link rel="stylesheet" href="css/reset.css"/>
  <link rel="stylesheet" href="css/components.css"/>
  <title></title>
  <style>

  </style>
</head>

<body>

<!--播放界面end-->
<style>

</style>
<script type="text/javascript" src="https://v1.vuejs.org/js/vue.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<!--改动start-->
<script src="https://unpkg.com/scrollreveal/dist/scrollreveal.min.js"></script>
<script>
  function init() {
    var e = {
      origin: "top",
      viewFactor: .15,
      duration: 800,
      distance: "0px",
      scale: .5,
      easing: 'ease',
      mobile: !0
    };
    window.sr = new ScrollReveal(e);
    var t = {
      reset: !1,
      viewOffset: {
        bottom: 100
      }
    };
    sr.reveal(".animate-box", t);
  }

  new Vue({
    el: '#app',
    data: {
      message: 'Hello Vue.js!',
      list: [],
      list2: [],
      step: 0,
      isShow: false
    },
    watch: {
      'step': function (e) {
        console.info(e);
        let self = this;
        if (e == 2) {
          init();
          self.$nextTick(function () {
            self.isShow = true;
          })
        }
      }
    },
    ready() {
      let self = this;
      //					this.list = 10;
      $.ajax({
        type: "get",
        url: "http://wechat.roobo.com/resource-zb/getCategroy",
        async: true,
        success: function (e) {
          self.list = e;
          self.$nextTick(function () {
            self.step += 1;
            console.info(e);
          })
        }
      });
      $.ajax({
        type: "get",
        url: "http://wechat.roobo.com/resource-zb/getSubCategroy/22/1/50",
        async: true,
        success: function (e) {
          self.list2 = e.categoryList;
          self.$nextTick(function () {
            self.step += 1;
            console.info(e.categoryList);
          })
          //							var host = "http://dwn.roo.bo/appimg/";
          //							console.info(e.categoryList);
          //							for(let i = 0; i<e.categoryList.length; i++){
          ////								console.info(i);
          //								console.info(host+e.categoryList[i].imgLarge);
          //							}
        }
      });

    }
  })
</script>
<!--改动end-->
<script>
  $(function () {

    //				$('.item-more').click(function() {
    //					$(this).toggleClass('active');
    //					if($(this).hasClass('active')) {
    //						//改动
    //						$(this).find('h5').text('收起分类');
    //					} else {
    //						$(this).find('h5').text('更多分类');
    //					}
    //					$('.top-category.more').stop(true, true);
    //					$('.top-category.more').toggle('fast');
    //				})
    //				$('.play-bar').click(function() {
    //					$('.play-component').show(0);
    //					$('.play-component').addClass('play-show');
    //				})
    //
    //				$('#play-component .close').click(function() {
    //					$('.play-component').removeClass('play-show');
    //				})

    $('.search-bar input').on('click', function () {
      $('.play-component').hide(0);
    })
  })
</script>
</body>

</html>
